<template>
    <Modal
            title="维修单详情"
            v-model="isOpen"

    >
        <Card class="detail-wrapper">
            <div>
                <span>故障设备名称:</span>{{row.name}}
            </div>
            <div>
                <span>订单状态:</span>
                {{row.statusStr}}
            </div>
            <div>
                <span>设备分类:</span>{{row.type}}
            </div>
            <div>
                <div>
                    <span>故障设备id:</span>{{row.deviceId}}
                </div>
                <span>生产时间:</span>{{row.productionTime}}
            </div>
            <div>
                <span>报修时间:</span>{{row.breakdownTime}}
            </div>
            <div>
                <span>报修详情:</span>
                <div style="word-wrap: break-word">
                    <span>{{row.detail}}</span>
                </div>
            </div>
        </Card>
    </Modal>
</template>

<script>
    export default {
        name: "order-detail",
        props: {
            value: {
                type: Boolean,
                default: false,
            },
            data: {
                type: Object,
                default: () => {
                }
            }
        },
        data() {
            return {
                row: {
                    name: null,
                    statusStr: "",
                    type: null,
                    deviceId: null,
                    productionTime: null,
                    breakdownTime: null,
                    detail: null
                },
                isOpen: false
            }
        },
        watch: {
            value(v) {
                this.isOpen = v
            },
            isOpen(v) {
                this.$emit("input", v)
            },
            data(v) {

                this.row = v
            }
        }
    }
</script>

<style scoped lang="scss">


    .detail-wrapper {
        span {
            font-size: 0.8em;
            margin: 0 10px;
            color: rgba(0, 0, 0, 0.8);
        }
    }
</style>

